<template>
  <div class="main-content">
    <div class="top">
      <div class="top-left">
        <div>
          <img :src="data.headPortrait" width="100" height="100">
        </div>
        <div class="top-left-personalData">
          <div>
            <span>{{ data.nickname }}</span>
          </div>
          <div>
            <router-link to="/personalCenter/personalData">完善资料，赠送积分<el-icon class="i" style="top:2px;"><Edit /></el-icon></router-link>
          </div>
        </div>
      </div>
    </div>
    <!--  引入我的订单  -->
    <Order>
        <div class="botton-header-order">
          <h3>近期订单</h3>
          <router-link to="/personalCenter/myOrder">所有订单 ></router-link>
        </div>
    </Order>
  </div>
</template>

<script setup>
import {reactive, onMounted, computed,getCurrentInstance} from "vue";
import {ElMessage} from "element-plus";
//引入vue-router
import { useRouter } from "vue-router";
//引入我的订单
import Order from './MyOrder.vue'
const router = useRouter();
//proxy
const {proxy} = getCurrentInstance();
let data = reactive({
  flag:true
});
//挂载后
onMounted(()=>{
  //发送get请求头像
  proxy.$get('/api/PersonalCenter/user',{})
      .then((date)=>{
        //赋值给头像和账号
        data.nickname = date[0].nickname;
        data.headPortrait = date[0].headPortrait;
      })
})
</script>

<style lang="less" scoped>
  @import "../../../assets/css/personalConter/personalData.less";
</style>